import Pagination from "@/components/pagination";
import {
  Message
} from "element-ui";
const easydate = require("@/untils/easydate");
export default {
  components: {
    Pagination
  },
  props: ["activeName"],
  data() {
    return {
      couseType:'',
      downLoadPg:false,
      downLoadHref:false,
      inCourseId:'', // 内部课程ID
      loading:false,
      smallLoading: false, // 微课程上传过度
      fileListMenus: [], // 默认视频
      preLoadPicture: '', // 内部课程详情图片
      preLoadList: [], // 内部课程图片展示
      fileListMenu: [], // 文件展示列表
      smallCourseImg: [], // 微课程文件展示
      dialogImageUrl: "",
      dialogVisible: false,
      removeList: false,
      imageUrl: "", // 上传的图片
      smalltips: "", // 新增弹框公用小标题
      classRadio: "", // 课程类型
      inside: false, // 内部课程弹窗
      checkApply: false, // 面授课程窗口
      checkApplys: false, // 微课程窗口
      checkChoose: false, // 课程类型选择窗口
      searchLoading: false,
      total: 10,
      tipText: "", // 弹框标题
      disAgree: false,
      agree: false,
      classType: "", // 课程类型
      teaName: '', // 导师名字
      xcPhoto:'',
      teaSelectList:[],
      smallTypeList:[
        {
          value: '0',
          label: '技术研发类'
        },
        {
          value: '1',
          label: '营销类'
        },
        {
          value: '2',
          label: '国际化类'
        },
        {
          value: '3',
          label: '职能管理类'
        },
        {
          value: '4',
          label: '生产管理类'
        },
        {
          value: '5',
          label: '技能类'
        },
        {
          value: '6',
          label: '通用知识类'
        },
      ],
      qryCourseByIdObj: {
        // 面授课程对象
        title: "", // 课程名称
        smallTitle: "", // 课程说明
        introduce: "", // 课程简介
        courseTime: "", // 时长
        date: "", // 日期
        time: "", // 时间
        address: "", // 地点
        num: "", // 人数
        isGood: 0, // 是否精品课程
        photoFile: null,
        userId: ''
      },
      qryCourseByIdObjs: {
        // 微课程对象
        name: "", // 课程名称
        smallType:'', // 课程类型
        introduce: "", // 课程简介
        "fileType": 0, // 0视频文件 1pdf
        "multipartFile": '',
        photoFile:''
      },
      // 面授课程表单校验
      rules: {
        title: [{
          required: true,
          message: "请输入课程名称",
          trigger: "blur"
        }],
        smallTitle: [{
          required: true,
          message: "请输入课程说明",
          trigger: "blur"
        }],
        courseTime: [{
          required: true,
          message: "请输入课程时长",
          trigger: "blur"
        }],
        date: [{
          required: true,
          message: "请选择课程日期",
          trigger: "blur"
        }],
        time: [{
          required: true,
          message: "请选择时间",
          trigger: "blur"
        }],
        address: [{
          required: true,
          message: "请填写地点",
          trigger: "blur"
        }],
        introduce: [{
          required: true,
          message: "请填写课程简介",
          trigger: "blur"
        }],
        teaName: [{
          required: true,
          message: "请选择导师名称",
          trigger: ["blur,change"]
        }],
        num: [{
          required: true,
          message: "请填写人数",
          trigger: "blur"
        }]
      },
      // 微课程校验
      smallClassRules: {
        name: [{
          required: true,
          message: "请输入课程名称",
          trigger: "blur"
        }],
        introduce: [{
          required: true,
          message: "请输入课程简介",
          trigger: "blur"
        }]
      },
      deletIds: [], // 批量删除id数组
      username: "",
      title: "",
      courseType: "",
      classId: "",
      tableData: []
    };
  },
  mounted() {
    let params = {
      title: "",
      username: "",
      courseType: "",
      page: 1,
      pageSize: 10
    };
    this.qryCourseOpenResult(params);
  },
  methods: {
    pageNum(prop) {
      this.searchList(prop, 10);
    },
    pageSizeNum(prop) {
      this.searchList(1, prop);
    },
    initData(row, column) {
      return row.courseType == 0 ?
        "内部课程" :
        row.courseType == 1 ?
        "外部课程" :
        row.courseType == 2 ?
        "微课程" :
        "暂无";
    },
    querySearch(queryString) {
      let params = {
        teaName: queryString
      }
      let that = this;
      this.loading = true;
      that.$get('qryTeaBySelect', params).then(res => {
        if (res.success) {
          this.teaSelectList = res.data;
          this.loading = false;
        }else{
          this.loading = false;
        }
      })
    },
    teaSelectChange(e){
      console.log(e)
      this.qryCourseByIdObj.userId = e;
    },
    addAttachment(file,fileList) {
      this.qryCourseByIdObj.photoFile = file.raw;
      this.fileListMenu = fileList;
    },
    smallAddAttachment(file,fileList) {
      this.qryCourseByIdObjs.photoFile = file.raw;
      this.smallCourseImg = fileList;

    },
    // 微课程文件
    addAttachments(file,fileList) {
      let isPdf = file.name.includes('pdf');
      if(isPdf){
        this.qryCourseByIdObjs.fileType = 1;
      }
      this.qryCourseByIdObjs.multipartFile = file.raw;
      this.fileListMenus = fileList;
    },
    limitNum() {
      Message({
        message: "只能上传一张图片",
        type: "warning",
        duration: 2000
      });
    },
    limitNums() {
      Message({
        message: "只能上传一个视频",
        type: "warning",
        duration: 2000
      });
    },
    // 视频文件删除
    limitRemoves(flie) {
      this.$refs.uploads.clearFiles();
      this.fileListMenus = [];
      this.qryCourseByIdObjs.multipartFile = null;
    },
    // 图片文件删除
    handleRemove(flie) {
      this.$refs.upload.clearFiles();
      this.fileListMenu = [];
      this.qryCourseByIdObj.photoFile = null;
    },
    // 图片文件删除
    smallHandleRemove(flie) {
      this.$refs.upload.clearFiles();
      this.smallCourseImg = [];
      this.qryCourseByIdObjs.photoFile = null;
    },
    addClass() {
      this.checkChoose = true;
      this.classType = 'xinz';
      this.qryCourseByIdObj = {
        // 面授课程对象
        title: "", // 课程名称
        smallTitle: "", // 课程说明
        introduce: "", // 课程简介
        courseTime: "", // 时长
        date: "", // 日期
        time: "", // 时间
        address: "", // 地点
        num: "", // 人数
        isGood: 0, // 是否精品课程
        photoFile: '',
        userId: ''
      }
      this.qryCourseByIdObjs = {
          // 微课程对象
          title: "", // 课程名称
          smallType:'',
          introduce: "", // 课程简介
          "fileType": 0, // 0视频文件 1pdf
          "multipartFile": '',
          photoFile:''
        },
      this.fileListMenu = [];
      this.fileListMenus = [];
      this.smallCourseImg = [];
      this.teaName = '';
      this.qryCourseByIdObj.date = '';
      this.qryCourseByIdObj.time = '';
    },
    goDetailModal() {
      if (!this.classRadio) {
        Message({
          message: "请选择课程类型",
          type: "warning",
          duration: 2000
        });
        return;
      }
      if (this.classRadio == 1) {
        this.checkApply = true;
        this.tipText = "面授课程新增";
        this.smalltips = "录入面授课程信息";
        this.checkChoose = false;
      } else {
        this.checkApplys = true;
        this.tipText = "微课程新增";
        this.smalltips = "录入微课程信息";
        this.checkChoose = false;
      }
    },
    uploadPg(){
      let classId = this.classId;
      let params = {
        id:classId
      }
      this.$get('downZipForCourse',params).then(res => {
        if(res.success){
          this.downLoadHref = res.data;
          this.downLoadPg = true;
        }
      })
    },
    deleteClass() {
      let ids = this.deletIds;
      if(ids.length == 0){
        Message({
          message: "请选择要删除项",
          type: "warning",
          duration: 2000
        });
        return;
      }
      this.$confirm("删除后不可恢复，确定删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        this.$post("deleteCourseOpenByIds", ids, true).then(res => {
          if (res.success) {
            Message({
              message: "操作成功",
              type: "success",
              duration: 2000
            });
            this.searchList(1, 10);
          }
        });
      })
    },
    submitForm(formName, formObj, type) {
      let that = this;
      let fileList = '';
      let smallCourseImg = ''
      that.$refs[formName].validate(valid => {
        if (valid) {
          if(!that.teaName && formObj=='qryCourseByIdObj'){
            Message({
              message: "请选择导师",
              type: "warning",
              duration: 2000
            });
            return;
          }
          if (this.classType == 'bianji') {
            // 编辑外部课程
            that.addOutCourse(formObj, type);
            return;
          } else {
            // 新增外部课程
            if (type == 1) {
              fileList = that[formObj].photoFile
              if (fileList) {
                that.addOutCourse(formObj, type);
              } else {
                Message({
                  message: "请上传宣传图片",
                  type: "warning",
                  duration: 2000
                });
              }
            } else if (type == 2) {
              fileList = that[formObj].multipartFile
              smallCourseImg = that[formObj].photoFile
              // 新增微课程
              if (fileList && smallCourseImg) {
                that.addOutCourse(formObj, type);
              } else if(!fileList){
                Message({
                  message: "请上传微视频",
                  type: "warning",
                  duration: 2000
                });
                return;
              }else if(!smallCourseImg){
                Message({
                  message: "请上传课程封面",
                  type: "warning",
                  duration: 2000
                });
                return;
              }
            }
          }
        } else {
          // console.log("error submit!!");
          Message({
            message: "请完善必填项",
            type: "warning",
            duration: 2000
          });
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    handleSelectionChange(e) {
      let that = this;
      let idArr = [];
      e.map(function (item) {
        idArr.push(item.id);
      });
      that.deletIds = idArr;
    },
    addOutCourseClose(done) {
      this.$nextTick(()=>{
        //等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields()，去除验证
        this.$refs.addOutCourse.clearValidate();
      });
      done();
    },
    insideDetail(done) {
      this.$nextTick(()=>{
        //等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields()，去除验证
        this.$refs.insideDetail.clearValidate();
      });
      done();
    },
    insertSmallCourse(done) {
      this.$nextTick(()=>{
        //等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields()，去除验证
        this.$refs.insertSmallCourse.clearValidate();
      });
      done();
    },
    closeDiloag(showStatus,form){
      this[showStatus] = false;
      this.$nextTick(()=>{
        //等弹窗里的form表单的dom渲染完在执行this.$refs.staffForm.resetFields()，去除验证
        this.$refs[form].clearValidate();
      });
    },
    searchList(page, pageSize) {
      let {
        title,
        username,
        courseType
      } = this;
      let params = {
        title,
        username,
        courseType,
        page,
        pageSize
      };
      this.searchLoading = true;
      this.qryCourseOpenResult(params);
    },
    applyClick(row) {
      let params = {
        id: row.id
      };
      let url = '';
      this.inCourseId = row.id;
      this.fileListMenu = [];
      this.fileListMenus = [];
      this.smallCourseImg = [];
      this.classId = row.id;
      this.couseType = row.courseType;
      if(row.courseType == 1 || row.courseType == 0){
        url = 'qryCourseById'
      }else if(row.courseType == 2){
        url = 'qrySmallCourseById'
      }
      this.$get(url, params, true).then(res => {
        if (res.success) {
          if (row.courseType == 0) {
            this.tipText = "课程详情";
            this.smalltips = '内部课程详情';
            this.inside = true; // 内部课程弹框
          } else if (row.courseType == 1) {
            this.tipText = "课程编辑";
            this.smalltips = '面授课程编辑';
            this.checkApply = true; // 面授课程弹框
            this.classType = 'bianji';
            this.qryCourseByIdObj.id = row.id;
          } else {
            this.tipText = "微课程编辑";
            this.checkApplys = true; // 微课程弹框
            this.classType = 'bianji';
            this.qryCourseByIdObjs.id = row.id;
          }
          if (res.data.courseType == 0) {
            res.data.courseType = "内部课程";
          } else if (res.data.courseType == 1) {
            res.data.courseType = "外部课程";
          } else {
            res.data.courseType = "微课程";
          }
          let {
            openTime,
            teaUsername,
            teaId,
            title,
            smallTitle,
            introduce,
            courseTime,
            address,
            num,
            isGood,
            photo,
            smallType,
            name
          } = res.data;
          if (row.courseType == 1 || row.courseType == 0) {
            let initOpentime = easydate(openTime).format("yyyy-MM-dd HH:mm");
            let date = initOpentime.split(' ')[0];
            let time = initOpentime.split(' ')[1];
            this.qryCourseByIdObj.smallTitle = smallTitle;
            this.qryCourseByIdObj.title = title;
            this.qryCourseByIdObj.introduce = introduce;
            this.qryCourseByIdObj.courseTime = courseTime;
            this.qryCourseByIdObj.address = address;
            this.qryCourseByIdObj.num = num;
            this.qryCourseByIdObj.isGood = isGood + '';
            this.qryCourseByIdObj.date = date;
            this.qryCourseByIdObj.time = time;
            this.qryCourseByIdObj.userId = teaId;
            this.teaName = teaUsername;
            this.xcPhoto = photo;
            this.fileListMenu.push({
              url: photo
            });
            this.preLoadPicture = photo;
            this.preLoadList = [photo]
          } else if (row.courseType == 2) {
            this.qryCourseByIdObjs.name = res.data.name;
            this.qryCourseByIdObjs.introduce = introduce;
            this.qryCourseByIdObjs.smallType = smallType;
            this.qryCourseByIdObjs.fileType = 0;
            this.fileListMenus.push({
              name:res.data.fileName,
              url: res.data.filePath
            });
            this.smallCourseImg.push({
              url: photo
            });
            this.qryCourseByIdObjs.multipartFile = null;
            this.qryCourseByIdObjs.photoFile = null;
          }
        }
      });
    },
    delClick(id) {
      let params = {
        id
      };
      this.$confirm("删除后不可恢复，确定删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(()=>{
        this.$get("deleteCourseOpenById", params, true).then(res => {
          if (res.success) {
            Message({
              message: "操作成功",
              type: "success",
              duration: 2000
            });
            this.searchList(1, 10);
          }
        });
      })
    },
    switchTab(){
      let id = this.inCourseId;
      let params = {
        id
      }
      this.$get('setGoodCourse',params).then(res => {
        if(res.success){
          Message({
            message: "操作成功",
            type: "success",
            duration: 2000
          });
        }else{
          Message({
            message: "操作失败",
            type: "warning",
            duration: 2000
          });
          return;
        }
      })
    },
    // 新增外部课程
    apply() {
      this.submitForm("addOutCourse", 'qryCourseByIdObj', 1);
    },
    // 新增微课程
    smallApply() {
      this.submitForm("insertSmallCourse", 'qryCourseByIdObjs', 2);
    },
    addOutCourse(formObj, type) {
      let params = this[formObj];
      let formdata = new FormData();
      let typeForClass = this.classType;
      let url = ''
      this.smallLoading = true;
      this.agree = true;
      this.disAgree = true;
      if(formObj == 'qryCourseByIdObjs'){
        if(this.fileListMenus.length == 0){
          Message({
            message: "请上传视频",
            type: "warning",
            duration: 2000
          });
          this.smallLoading = false;
          this.agree = false;
          this.disAgree = false;
          return;
        }
        if(this.smallCourseImg.length == 0){
          Message({
            message: "请上传封面图片",
            type: "warning",
            duration: 2000
          });
          this.smallLoading = false;
          this.agree = false;
          this.disAgree = false;
          return;
        }
        if(!params.multipartFile){
          delete params.multipartFile;
        }
        if(!params.photoFile){
          delete params.photoFile;
        }
      }else{
        if(this.fileListMenu.length == 0){
          Message({
            message: "请上传图片",
            type: "warning",
            duration: 2000
          });
          this.agree = false;
          this.disAgree = false;
          return;
        }
        if(!params.photoFile){
          delete params.photoFile;
        }
      }

      for (var key in params) {
        formdata.append(key, params[key]);
      }
      let config = {
        header: {
          'Content-Type': 'mutipart/form-data'
        }
      }
      if (type == 1) {
        if (typeForClass == 'xinz') {
          url = "/coursePC/addOutCourse";
        } else if (typeForClass == 'bianji') {
          url = "/coursePC/updateOutCourse";
        }
      } else {
        if (typeForClass == 'xinz') {
          url = "/coursePC/insertSmallCourse";
        } else if (typeForClass == 'bianji') {
          url = "/coursePC/updateSmallCourse";
        }
      }
      this.$http.post(url, formdata, config).then(res => {
        if (res.data.success) {
          this.smallLoading = false;
          this.agree = false;
          this.disAgree = false;
          Message({
            message: "操作成功",
            type: "success",
            duration: 2000
          });
          if (status == 0) {
            this.disagree = false;
          } else {
            this.agree = false;
          }
          if (type == 1) {
            this.checkApply = false;
          } else {
            this.checkApplys = false;
          }
          this.searchList(1, 10);
        } else {
          this.agree = false;
          this.disAgree = false;
          this.smallLoading = false;
        }
      });
    },
    qryCourseOpenResult(params) {
      this.$post("qryCourseOpenResult", params).then(res => {
        if (res.success) {
          let isObjNull = JSON.stringify(res.data);
          if (isObjNull !== "{}") {
            this.tableData = res.data.courseOpenPCBacks;
            this.total = res.data.totals;
          }
          this.searchLoading = false;
        }
      });
    }
  }
};
